import React from 'react'
import { observer,inject } from 'mobx-react'
import { TabBar } from 'antd-mobile';
import '../style/Public-tab.css'
// @inject('Video')
// @observer
class TabBarExample extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedTab: 'Discover',
      hidden: false,
      fullScreen: false,
    };
  }
//   Tabpush(ele){
//     this.props.history.push({pathname:`${ele}`})
//   }


// componentWillReceiveProps(newProps){
//   console.log(newProps)
//    const path = newProps.pops.location.pathname
//    console.log(path)
//   this.setState({
//     selectedTab:path
//   })
// console.log(this.state.selectedTab)
// }


// componentDidMount(){
//   console.log(121212)
//   // const path=this.pops.location.pathname
//  console.log(this.props)
//  const path=this.props.pops.location.pathname
//  console.log(path)
//   if(path=="/"){
//     this.props.history.push("/Discover")
//    console.log(211212121)
//   }else{
//     this.setState({
//       selectedTab:path
//     })
   
//   }
//   console.log(this.state.selectedTab)
 
// }



  render(){
    // const { props } = this.props
   
      return(
          <div className="Public-Tab">
               <TabBar
            unselectedTintColor="#949494"
            tintColor="#33A3F4"
            barTintColor="white"
            hidden={this.state.hidden}
        >
              {/* background: 'url(https://zos.alipayobjects.com/rmsportal/sifuoDUQdAFKAVcFGROC.svg) center center /  21px 21px no-repeat' }} */}

            <TabBar.Item
            icon={  <div style={{
              width: '22px',
              height: '22px',
              
              background: 'url('+require('../../src/img/发现.png')+') center center /  21px 21px no-repeat' }}
            />}
            selectedIcon={<div style={{
              width: '22px',
              height: '22px',
              background: 'url('+require('../../src/img/发现 (1).png')+') center center /  21px 21px no-repeat' }}
            />}
            title="发现"
            key="my"
            selected={this.state.selectedTab === 'Discover'}
            onPress={() => {
            this.setState({
                selectedTab: 'Discover',
            });
            this.props.pops.history.push({pathname:'/Discover'})
         
            }}
        >
        </TabBar.Item>
        <TabBar.Item
            icon={
              <div style={{
                width: '22px',
                height: '22px',
                
                background: 'url('+require('../../src/img/视频.png')+') center center /  21px 21px no-repeat' }}
              />
            }
            selectedIcon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url('+require('../../src/img/视频 (1).png')+') center center /  21px 21px no-repeat' }}
              />
            }
            title="视频"
            key="Video"
            // dot
            selected={this.state.selectedTab === 'Vider'}
            onPress={() => {
              this.setState({
                selectedTab: 'Vider',
              });
              this.props.pops.history.push({pathname:'/Vider'})
            }}
          >
               {/* {console.log('13')} */}
            {/* { this.props.history.push({pathname:'/Vider'})} */}
          </TabBar.Item>
          <TabBar.Item
            icon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url('+require('../../src/img/我 的.png')+') center center /  21px 21px no-repeat' }}
              />
            }
            selectedIcon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url('+require('../../src/img/我 的 (1).png')+') center center /  21px 21px no-repeat' }}
              />
            }
            title="我的"
            key="Koubei"
            // badge={'new'}
            selected={this.state.selectedTab === 'redTab'}
            onPress={() => {
              this.setState({
                selectedTab: 'redTab',
              });
              // console.log(this.pops)
              this.props.pops.history.push({pathname:'/Mymsg'})
            }}
            data-seed="logId1"
          >
            {/* {this.renderContent('Koubei')} */}
          </TabBar.Item>
          <TabBar.Item
            title="账号"
            key="Life"
            icon={<div style={{
              width: '22px',
              height: '22px',
              background: 'url('+require('../../src/img/账号.png')+') center center /  21px 21px no-repeat' }}
            />
            }
            selectedIcon={<div style={{
              width: '22px',
              height: '22px',
              background: 'url('+require('../../src/img/账号 (1).png')+') center center /  21px 21px no-repeat' }}
            />
            }
            selected={this.state.selectedTab === 'blueTab'}
            // badge={1}
            onPress={() => {
             
              this.setState({
                selectedTab: 'blueTab',
              });
                this.props.pops.history.push({pathname:'/Account'})
            }}
            data-seed="logId"
          >
            {/* {this.renderContent('Life')} */}
          </TabBar.Item>
        </TabBar>
          </div>
      )
  }
}

export default  TabBarExample